{extend name="_container/add"}
{block name="html_head"}
<link rel="stylesheet" href="/static/admin/plugin/codemirror-5.65.0/lib/codemirror.css">
<script src="/static/admin/plugin/codemirror-5.65.0/lib/codemirror.js"></script>
<link rel="stylesheet" href="/static/admin/plugin/codemirror-5.65.0/theme/rubyblue.css">
<link rel="stylesheet" href="/static/admin/plugin/codemirror-5.65.0/addon/lint/lint.css">
<script src="/static/admin/plugin/codemirror-5.65.0/addon/lint/lint.js"></script>
<script src="/static/admin/plugin/codemirror-5.65.0/mode/php/php.js"></script>
{/block}
{block name="content"}
<div class="layui-form-item">
    <label class="layui-form-label required">方法类型<span></span></label>
    <div class="layui-input-inline">
        <select name="type" id="type" lay-ignore class="select2">
            <option value="">请选择方法类型</option>
            <option value="list">列表</option>
            <option value="add">新增</option>
            <option value="update">修改</option>
            <option value="delete">删除</option>
            <option value="set">设置数据</option>
            <option value="update_other">设置数据 + 更新</option>
        </select>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>


<div class="layui-form-item">
    <label class="layui-form-label required">请求类型<span></span></label>
    <div class="layui-input-inline">
        <select name="request" id="request" lay-ignore class="select2">
            <option value="">请选择请求类型</option>
            <option value="get">get</option>
            <option value="post">post</option>
            <option value="get_view">get_view</option>
            <option value="post_view">post_view</option>
        </select>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label required">方法中文名<span></span></label>
    <div class="layui-input-inline">
        <input type="text" placeholder="" name="comment"  class="layui-input modelform_name"
               lay-verify="required"     value="" style="" autocomplete="off" id="comment">
        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label required">方法英文名<span></span></label>
    <div class="layui-input-inline">
        <input type="text" placeholder="" name="name"  class="layui-input modelform_name"
               lay-verify="required"     value="" style="" autocomplete="off" id="name">
        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label required">默认分页条数<span></span></label>
    <div class="layui-input-inline">
        <input type="text" placeholder="" name="list_row"  class="layui-input modelform_name"
               lay-verify="required"     value="15" style="" autocomplete="off" id="listRow">
        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label">按钮样式</label>
    <div class="layui-input-inline">
        <?php
        $style_arr = [
        0 => '',
        1 => 'layui-btn-primary',
        2 => 'layui-btn-normal',
        3 => 'layui-btn-warm',
        4 => 'layui-btn-danger',
        5 => 'layui-btn-radius',
        6 => 'layui-btn-primary layui-btn-radius',
        7 => 'layui-btn-normal layui-btn-radius',
        8 => 'layui-btn-warm layui-btn-radius',
        9 => 'layui-btn-danger layui-btn-radius',

        ];
        ?>
        <div style="width: 20px;"></div>
        {foreach $style_arr as $k=>$v}
            <div style="display: flex;flex-direction: column;align-items: center;padding: 0 5px;justify-content: center">
                <span class="layui-btn layui-btn-sm {$v}" >button</span>
                <input type="radio" name="style" id="style" value="{$v}" {$r.style==$v?'checked':''}>
            </div>
        {/foreach}
    </div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label">按钮名称</label>
    <div class="layui-input-inline">
        <input type="text" class="layui-input" name="title" value="{$r.title}" required id="title">
    </div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label">按钮提示</label>
    <div class="layui-input-inline">
        <input type="text" class="layui-input" name="msg" value="{$r.msg}"  id="msg">
    </div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label">是否iframe</label>
    <div class="layui-input-inline">
        <input type="radio" class="layui-input" name="is_iframe" checked value="1"  title="是">
        <input type="radio" class="layui-input" name="is_iframe" value="0"  title="否">
    </div>
</div>


<div class="layui-form-item">
    <label class="layui-form-label">iframe高度</label>
    <div class="layui-input-inline">
        <input type="text" class="layui-input" name="height" value="{$r.height}"  id="height">
    </div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label">iframe宽度</label>
    <div class="layui-input-inline">
        <input type="text" class="layui-input" name="width" value="{$r.width}"  id="width">
    </div>
</div>


<div class="layui-form-item">
    <label class="layui-form-label required">是否code自定义<span></span></label>
    <div class="layui-input-inline" >
        <select name="is_user_define" class="layui-select">
            <option value="0">否</option>
            <option value="1">是</option>
        </select>
        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>



<div class="layui-form-item">
    <label class="layui-form-label required">是否view自定义<span></span></label>
    <div class="layui-input-inline" >
        <select name="is_user_view" class="layui-select">
            <option value="0">否</option>
            <option value="1">是</option>
        </select>
        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>

<div class="layui-form-item">
    <label class="layui-form-label required">字段选择<span></span></label>
    <div class="layui-input-inline">

        <div class="description"></div>
    </div>
    <div class="layui-form-mid layui-word-aux"></div>
</div>


<div style="display: flex;justify-content: space-between;margin-top: 10px;">
    <div style="width: 50%">
        <table class="layui-table" style="width: 100%">
            <tr>
                <th>输入表</th>
                <th>输入字段</th>
                <th>条件</th>
                <th>操作</th>
            </tr>
            <tr>
                <td style="text-align: right" colspan="3"><span class="layui-btn layui-btn-sm" id="btn_add"
                                                                onclick="addInput(this)">增加</span></td>
            </tr>

        </table>
    </div>
    <div style="width: 50%">
        <table class="layui-table" style="width: 100%">
            <tr>
                <th>输出表</th>
                <th>输入字段</th>
                <th>别名</th>
                <th>操作</th>
            </tr>
            <tr>
                <td style="text-align: right" colspan="3"><span class="layui-btn layui-btn-sm" id="btn_add1"
                                                                onclick="addOutput(this)">增加</span></td>
            </tr>
        </table>
    </div>
</div>

<div><span class="layui-btn" onclick="getCode()">获取代码</span></div>
<textarea name="myTextarea1" id="myTextarea2">{$codeMini}</textarea>
<textarea name="code" id="code" hidden></textarea>

<div style="height: 20px"></div>
<textarea name="myTextarea3" id="myTextarea3"></textarea>
<textarea name="code_view" id="code_view" hidden></textarea>

<input type="hidden" name="controller_id" value="{:input('controller_id')}">
<input type="hidden" name="table_name" value="{$table_name}">

<div style="height: 209px"></div>
{/block}
{block name="js"}
<script>
    let editor2 = CodeMirror.fromTextArea(myTextarea2, {
        lineNumbers: true,
        theme: 'rubyblue',
        matchBrackets: true,
        mode: "application/x-httpd-php",

    });

    let editor3 = CodeMirror.fromTextArea(myTextarea3, {
        lineNumbers: true,
        theme: 'rubyblue',
        matchBrackets: true,
        mode: "htmlmixed",

    });
</script>


<script>
    function save_form3(obj) {
        let code = editor2.getValue();
        $("#code").val(code);
        let code_view = editor3.getValue();
        $("#code_view").val(code_view);
        save_form2(obj);
        return false;
    }
</script>



<script>
    $("#comment").blur(
        (obj)=>{
            let word = obj.target.value;
            $('#title').val(word);
            if(word){
                $.post('/auto/util/getMethodEnglish',{word},(data)=>{
                    let res = data.result;
                    $("#name").val(res);
                })
            }

        }
    )

    $("#type").change(
        (obj) => {
            let type = obj.target.value;
            let comment = $("#comment");
            if(type) {
                switch (type) {
                    case 'list':
                        comment.val('列表');
                        break;
                    case 'add':
                        comment.val('新增');
                        break;
                    case 'update':
                        comment.val('修改');
                        break;
                    default:
                        break;
                }
                comment.focus();
            }
        }
    )
</script>





<script>
    function addInput(obj) {
        let tr = $(obj).parents('tr');
        $(tr).before(`<tr>
<td>
<select name="in_tables[ ]" class="select2" lay-ignore style="width: 100%" onchange="getInFields(this)">
<option value="">请选择</option>
 {foreach $tables as $table}
     <option value="{$table.name}">{$table.comment}</option>
 {/foreach}
</select>
</td>
<td>
<select name="in_fields[ ]" style="width: 100%" class="select2"  lay-ignore onchange="getCondition(this)">
<option value="">请选择</option>
</select>
</td>
<td>
<input name="in_conditions[ ]" style="width: 100%"  type="text" class="layui-input">
</td>
<td><span class="layui-btn layui-btn-danger layui-btn-xs" onclick="$(this).parents('tr').remove();">X</span></td>
</tr>`);
        $('.select2').select2();
    }

    function addOutput(obj) {
        let tr = $(obj).parents('tr');
        $(tr).before(`<tr>
<td>
<select name="out_tables[ ]" lay-ignore style="width: 100%" class="select2" onchange="getOutFields(this)">
<option value="">请选择</option>
 {foreach $tables as $table}
     <option value="{$table.name}">{$table.comment}</option>
 {/foreach}
</select>
</td>
<td>
<select name="out_fields[ ]" lay-ignore class="select2" style="width: 100%" onchange="getAlias(this)">
<option value="">请选择</option>
</select>
</td>
<td>
<input name="out_alias[ ]" style="width: 100%" type="text" class="layui-input">
</td>
<td><span class="layui-btn layui-btn-danger layui-btn-xs" onclick="$(this).parents('tr').remove();">X</span></td>
</tr>`);
        $('.select2').select2();
    }
</script>


<script>


    function getInFields(obj) {
        let url = 'getFieldOptionsByTableName';
        let table_name = obj.value;
        $.post(url, {table_name}, (res) => {
            $(obj).parents('tr').find("select[name='in_fields[ ]']").html(res).select2();
        })
    }

    function getOutFields(obj) {
        let url = 'getFieldOptionsByTableName';
        let table_name = obj.value;
        $.post(url, {table_name}, (res) => {
            $(obj).parents('tr').find("select[name='out_fields[ ]']").html(res).select2();
        })
    }

    function getAlias(obj) {
        let input = $(obj).parents('tr').find("input[name='out_alias[ ]']");
        if (obj.value) {
            let data = $($(obj).select2('data')[0].element).data('alias');
            input.val(data)
        } else {
            input.val('')
        }

    }

    function getCondition(obj) {
        let input = $(obj).parents('tr').find("input[name='in_conditions[ ]']");
        if (obj.value) {
            let data = $($(obj).select2('data')[0].element).data('alias');
            input.val("= input('"  + data + "','')")
        } else {
            input.val('')
        }
    }

</script>

<script>
    function getCode() {
        let data = $('#form').serializeArray();
        $.ajax({
            url: '/auto/relation/getCode',
            type: 'post',
            async: true,
            data,
            dataType: 'json',
            success: function (result) {
                let code = result.result;
                editor2.setValue(code)
            },
            error: function (xhr, textStatus) {
                alert("程序出错，请联系管理员");
            },

        })
    }

</script>

<script>
    for (let i = 0; i < 6; i++) {
        $("#btn_add").click()
        $("#btn_add1").click()
    }
</script>
{/block}

{/extend}
